<template>
	<!-- 待激活用户 -->
	<view class="jihuos">
		<view class="yhs"  v-for="(item,index) in awaits" :key="index">
			<view class="leves">
				<view style="font-size: 30rpx;color: rgba(68, 68, 68, 1);">{{item.user.name}}</view>
				<view style="font-size: 22rpx;color:RGBA(110, 110, 110, 1);margin: 0 55rpx;">{{item.user.level_name}}</view>
			</view>
			<view class="leves">
				<view style="font-size: 22rpx;color: rgba(86, 86, 86, 1);">{{item.user.tel}}</view>
				<view style="font-size: 22rpx;color:RGBA(110, 110, 110, 1);margin: 0 55rpx;">{{item.user.date}}</view>
			</view>
			<view class="biaoji">
				<image @tap="tasg(item.user.uid,item.user.tag,index)"  v-if="item.user.tag"  src="../../static2/biaoji.png" mode="" ></image>
				<image @tap="tasg(item.user.uid,item.user.tag,index)" v-else src="../../static2/weibiaoji.png" mode="" ></image>
				<text class="biaojis" v-if="item.user.tag"  style="color: rgba(88, 208, 106, 1);">标记</text>
			<text class="biaojis"  v-else  style="color: rgba(52, 52, 52, 1);">标记</text>
			</view>
			<!-- 亲推 -->
				<view class="str">{{str}}</view>
				<view class="bohao" @tap="baohao(index)">
					<image src="../../static2/bohao.png" mode="" style="width: 40rpx;height: 40rpx;margin-right: 11rpx;"></image>
					<text class="yijian">一 键 拨 号</text>
				</view>
				</view>
				<view style="font-size: 15rpx;color: rgba(68, 68, 68, 1);text-align: center;margin-top: 20rpx;">没有更多了</view>
				<!-- 提现弹框 -->
				<uni-popup ref="popup" type="center">
					<view class="tabk">
						<view class="tabk_1" style="margin-bottom: 20rpx;">
							<text style="font-size: 28rpx;line-height: 70rpx;">选择拨打号码</text>
							<image @tap="close" src="../../static2/quxiao.png" mode="" style="width: 40rpx;height: 40rpx;transform: translate(130rpx,10rpx);"></image>
						</view>
						<view v-for="(item,index) in awaits" :key="index">
							<view class="tabk_2" v-for="(item1,index1) in item.call" :key="index1" >
							<view style="font-size: 24rpx;transform: translateY(15rpx);">{{item1.show_str}}</view>
							<view style="transform: translateY(40rpx);">{{item1.tel}}</view>
							<image  src="../../static2/bohao.png" mode="" style="width: 40rpx;height: 40rpx;transform: translate(220rpx,-30rpx);"></image>
						</view>
						</view>
						
						<!-- <view class="tabk_3" >
							<view style="font-size: 24rpx;transform: translateY(15rpx);">{{call[1].show_str}}</view>
							<view style="transform: translateY(40rpx);">{{call[1].tel}}</view>
							<image src="../../static2/bohao.png" mode="" style="width: 40rpx;height: 40rpx;transform: translate(220rpx,-30rpx);"></image>
						</view> -->
					</view>
				</uni-popup>
		
		
	</view>
</template>

<script>
	import uniPopup from "@/components/uni-popup/uni-popup.vue";
	export default {
		data(){
			return{
				page:1,
				size:10,
				awaits: [] ,//user数组,
				tag: 0,
				tasgs: false,
				str: '',
				call: [],
				show_str:''
			}
		},
		onShow() {
			this.activate()
		},
		methods:{
			activate(){
				var vm = this
				vm.req.post(
					vm.lochost + '/index/index?method=await_activate_user_list',
					{
						page:vm.page,
						size:vm.size
					},{},
					function(res){
						console.log(res.data.data);
						var await_list = res.data.data
						for(let i = 0;i<await_list.length; i++){
							vm.awaits.push(await_list[i])
							var strd = await_list[i].str
							vm.str = strd.toString()
							vm.call = await_list[i].call
							
						}
					}
				)
			},
			tasg(id,bj,index){
				var vm = this
				vm.req.post(
					vm.lochost + '/index/index?method=click_tag',
					{
						uid:id,
						type:1,
						tag:bj
					},{},
					function(res){
						console.log(res);
						if(res.code == 200){
							var awaits = vm.awaits
						vm.req.each(awaits,function(i,v){
							if(index==i){
								if(v.user.tag==res.data.tag){
									v.user.tag=res.data.tag;
								}else{
									v.user.tag=res.data.tag;
								}
								awaits[i]=v;
							}
						})
						vm.awaits = awaits
						}
						
					}
				)
				
				// var awaits = this.awaits
				// this.req.each(awaits,function(i,v){
				// 	if(index==i){
				// 		if(v.user.tag==1){
				// 			v.user.tag=0;
				// 		}else{
				// 			v.user.tag=1;
				// 		}
				// 		awaits[i]=v;
				// 	}
				// })
				// this.awaits = awaits
			},
			// 拨号弹框
			baohao(index){
				
				this.$refs.popup.open()
			},
			// 隐藏拨号弹框
			close(){
				
				this.$refs.popup.close()
			},
			// 拨打用户号码
			yhhaoma(phone){
				console.log(phone);
			}
		},
		components: {
			uniPopup
		}
	}
</script>

<style>
	.yhs{
		width: 750rpx;
		height: 220rpx;
		background-color: #FFFFFF;
		margin-bottom: 10rpx;
	}
	.leves{
		display: flex;
		justify-content: space-between;
		transform: translateY(15rpx);
		margin: 0 24rpx;
	}
	.biaoji image{
		position: absolute;
		/* top: 120rpx; */
		left: 690rpx;
		width: 40rpx;
		height: 40rpx;
		margin-top: -60rpx;
	}
	.biaojis {
		position: absolute;
		left: 690rpx;
		margin-top: -15rpx;
		font-size: 22rpx;
		}
		
		.str{
			font-size: 5rpx;
			margin-top: 29rpx;
			margin-left: 24rpx;
		}
		.bohao{
			margin-top: 30rpx;
			text-align: center;
		}
		.yijian{
			font-size: 35rpx;
			color: rgba(80, 160, 254, 1);
		}
		.tabk{
			width: 540rpx;
			height: 351rpx;
			background-color: rgba(243, 243, 243, 1);
			border-radius: 16rpx;
		}
		.tabk_1{
			width: 540rpx;
			height: 70rpx;
			background-color: #FFFFFF;
			border-radius: 16rpx 16rpx 0 0;
			text-align: center;
			/* transform: translateY(10rpx) */
		}
		.tabk_2{
			margin-top:20rpx;
			width: 540rpx;
			height: 120rpx;
			background-color: #FFFFFF;
			text-align: center;
			/* transform: translateY(-60rpx); */
		}
		.tabk_3{
			margin-top:20rpx;
			width: 540rpx;
			height: 120rpx;
			background-color: #FFFFFF;
			text-align: center;
			border-radius:  0 0 16rpx 16rpx;
		}
</style>
